﻿<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>上传身份证</title>
    <meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=0">
    <link rel="stylesheet" href="/lobsteruiframe/weui/css/weui.css" />
    <link rel="stylesheet" href="/lobsteruiframe/weui/css/weuix.css" />
    <link href="/customer/css/blue.css" rel="stylesheet" />
    <script src="/lobsteruiframe/weui/js/zepto.min.js"></script>
    <script src="/lobsteruiframe/weui/js/zepto.weui.js"></script>
    <script src="/lobsteruiframe/weui/js/php.js"></script>
    <script src="/jslib/template-web.js"></script>
    <script src="/jslib/lobster.js"></script>
    <!-- OSS需要引用此文件 -->
    <script src="/jslib/aliyun-oss-sdk.min.js"></script>
    <style>
        .item {
            border-top: 0.5px solid #e1e1e1;
            border-bottom: 5px solid #f5f5f5;
            padding: 10px 0;
            padding-left: 25px;
        }

        .piccontent {
            margin-top: 10px;
            border-bottom: 5px solid #f5f5f5;
        }

        .cardimg {
            height: 130px;
            width: 80%;
        }

        .displaycenter {
            display: flex;
            flex-direction: column;
            align-items: center;
            position: relative;
        }
    </style>
</head>
<body>

    <div class='pageContent'>
        <div class="weui-panel__hd">注意事项</div>
        <div class="item">
            <div class="page-hd-desc">1.请上传本人身份证照片；</div>
            <div class="page-hd-desc">2.请上传正、反两面；</div>
            <div class="page-hd-desc">3.拍照时请确保图像清晰，光线均匀。</div>
        </div>
        <div class="weui-panel__hd">身份证信息</div>
        <div class="piccontent">
            <div class="weui-flex">
                <div class="weui-flex__item displaycenter " data-type="1">
                    <input class="weui-uploader__input" accept="image/*" multiple="" type="file" id="file_idcardFont">
                    <img src="../images/idcardFont.png" mode='aspectFit' class="cardimg" id="idcardFont" />
                    <div class="page-hd-desc">身份证人像面</div>
                </div>
                <div class="weui-flex__item displaycenter " data-type="2">
                    <input class="weui-uploader__input" accept="image/*" multiple="" type="file" id="file_idcardback">
                    <img src="../images/idcardBack.png" mode='aspectFit' class="cardimg " id="idcardback" />
                    <div class="page-hd-desc">身份证国徽面</div>
                </div>
            </div>
        </div>

        <div class="weui-cells weui-cells_form">
            <div class="weui-cell">
                <div class="weui-cell__hd"><label class="weui-label">真实姓名</label></div>
                <div class="weui-cell__bd">
                    <input class="weui-input" id="txtname" placeholder="请输入真实姓名">
                </div>
            </div>
            <div class="weui-cell">
                <div class="weui-cell__hd">
                    <label class="weui-label">身份证号</label>
                </div>
                <div class="weui-cell__bd">
                    <input class="weui-input" id="txtidcard" placeholder="上传身份证识别身份证号">
                </div>

            </div>

        </div>

        <div>

            <a href="javascript:;" class="weui-btn weui-btn_primary" id="save">上传</a>
        </div>
    </div>
</body>
</html>


<script type="text/javascript">


    lobsterh5.main({
        data: {
            pagedata: {
                IdFrt_Status: 1, //0识别成功，1不成功
                IdBk_Status: 1, //0识别成功，1不成功
                FrantUrl: "", //正面图片地址
                BackUrl: "", //反面图片地址
                Name: "", //真实姓名
                CardNo: "", //身份证号码
                Birthday: "",
                SexIndex: 1,
                Sex: "男",
                patientId: -1,

                patientInfo: {},
            }
        },
        pageload() {
            var self = this;
            self.initevent();
            self.data.pagedata.patientId = lobsterh5.GetUrlParam("patientId");
            self.getpatientbyid(self.data.pagedata.patientId);
        },
        //初始化事件
        initevent: function () {
            var self = this;
            //保存
            $(document).on("click", "#save", function () {
                if (!self.data.pagedata.FrantUrl || !self.data.pagedata.BackUrl) {
                    $.toast("未上传身份证图片");
                    return;
                }
                if (!self.data.pagedata.Name || !self.data.pagedata.CardNo) {
                    $.toast("未完善姓名或者身份证号码");
                    return;
                }
                if (self.data.pagedata.IdFrt_Status == 0 && self.data.pagedata.IdBk_Status == 0) {
                    if (self.data.pagedata.patientInfo) {
                        if (self.data.pagedata.patientInfo.Name != self.data.pagedata.Name || self.data.pagedata.patientInfo.IDCard != self.data.pagedata.CardNo) {
                            $.toast("识别的姓名或身份证与之前填写的不一致", "forbidden");
                        }
                        else {
                            self.savedata();
                        }
                    }
                }
                else {
                    $.toast("验证不通过，无法提交", "forbidden");
                }
            });

            //上传身份证正面
            lobsterh5.OSSUploadFile('#file_idcardFont', function (res) {
                console.log(res);
                $.showLoading("正在上传...");
            }, function (res) {
                console.log(res);
                $.hideLoading();
                $("#idcardFont").attr("src", res.url);
                self.uploadorcidcard(res.url, 1);//识别身份证正面
            });

            //上传身份证反面
            lobsterh5.OSSUploadFile('#file_idcardback', function (res) {
                console.log(res);
                $.showLoading("正在上传...");
            }, function (res) {
                console.log(res);
                $.hideLoading();
                $("#idcardback").attr("src", res.url);
                self.uploadorcidcard(res.url, 2);//识别身份证反面
            });
        },
        //获取就诊人信息
        getpatientbyid(patientId) {
            var self = this;
            var data = {
                patientId: patientId
            };
            lobsterh5.GET("/admin/v1/CPatient/GetPatientByPId", data).then(res => {
                console.log(res);
                self.data.pagedata.patientInfo = res.patientInfo;
            }).catch(res => {
                self.data.pagedata.patientInfo = {};
                console.log(res);
                $.toast(res.msg || "获取就诊人失败", "forbidden");
            });
        },
        //身份证图片识别
        uploadorcidcard(picurl, type) {
            var self = this;
            var data = {};
            data.fileFullPath = picurl;
            lobsterh5.GET("/admin/v1/CPatient/UploadORCIDCard", data).then(res => {
                console.log(res);
                var json = JSON.parse(info.IdFrtJson);
                if (json.errcode == 0) {
                    if (type == 1) { //头像面
                        if (json.type == "Front") {
                            self.data.pagedata.Name = json.name;
                            self.data.pagedata.CardNo = json.id;
                            self.data.pagedata.IdFrt_Status = 0;
                            self.data.pagedata.FrantUrl = res.data.fullSrc;
                            $("#txtname").val(json.name);
                            $("#txtidcard").val(json.id);
                            //计算身份证号码获取性别和出生日期
                            self.showIdInfo(json.id);
                        } else {
                            $.toast('请上传身份证头像面！', 'forbidden');
                        }
                    } else if (type == 2) { //国徽面
                        if (json.type == "Back") {
                            self.data.pagedata.IdBk_Status = 0;
                            self.data.pagedata.BackUrl = res.data.fullSrc;
                        } else {
                            $.toast('请上传身份证国徽面！', 'forbidden');
                        }
                    }
                } else {//识别失败
                    $.toast(self.getErrorMsg(json.errorcode), 'forbidden');
                }
            }).catch(res => {
                console.log(res);
                $.toast(res.msg || "操作失败", "forbidden");
            });
        },
        //身份证识别错误代码
        getErrorMsg(errorCode) {
            var errorMsg;
            switch (errorCode) {
                case 45002:
                    errorMsg = '图片大小不能超过2M';
                    break;
                case -1:
                    errorMsg = '系统错误，请稍后重试';
                    break;
                case 101000:
                    errorMsg = '图片URL错误或拉取URL图像错误';
                    break;
                case 101001:
                    errorMsg = '图片中无法找到证件';
                    break;
                case 101002:
                    errorMsg = '图片数据无效';
                    break;
                default:
                    errorMsg = '身份证识别错误';
                    break;
            }
            return errorMsg;
        },
        //计算身份证号码获取性别和出生日期
        showIdInfo(cardNo) {
            var self = this;
            //身份证性别判断 奇数--》男   偶数--》女
            var sexindex;
            if (cardNo.length == 18) {
                sexindex = cardNo.charAt(16) % 2 == 0 ? 2 : 1;
            } else if (cardNo.length == 15) {
                sexindex = cardNo.charAt(14) % 2 == 0 ? 2 : 1;
            }

            self.data.pagedata.SexIndex = sexindex;
            self.data.pagedata.Sex = sexindex == 1 ? '男' : '女';
            var sBirthday = cardNo.substr(6, 4) + "-" + Number(cardNo.substr(10, 2)) + "-" + Number(cardNo.substr(12, 2));
            //根据身份证号码获取到出生日期，给控件出生日期赋值，不能修改。
            if (sBirthday.length > 0) {
                self.data.pagedata.Birthday = sBirthday;
            }
        },
        //保存
        savedata() {

            $.showLoading("正在保存...");
            var self = this;
            var data = {};
            data.name = self.data.pagedata.Name;
            data.idcard = self.data.pagedata.CardNo;
            data.furl = self.data.pagedata.FrantUrl;
            data.burl = self.data.pagedata.BackUrl;
            data.patid = self.data.pagedata.patientId;
            data.sex = self.data.pagedata.SexIndex;
            data.birthday = self.data.pagedata.Birthday;
            lobsterh5.POST("/admin/v1/CPatient/UpdatePatient", data).then(res => {
                $.hideLoading();
                console.log(res);
                if (res.flag == 0) {
                    $.toast(res.msg || "认证成功", "text");
                    setTimeout(() => {
                        location.replace("patient.html");
                    }, 1000);
                } else {
                    $.toast(res.msg || "认证失败", "forbidden");
                }

            }).catch(res => {
                console.log(res);
                $.hideLoading();
                $.toast(res.msg || "认证失败", "forbidden");
            });
        }
    });
</script>